<template>
	<el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
		<el-form-item label="议题名称" prop="name">
			<div v-if="is_admin">
				{{ form.name }}
			</div>
			<div v-else>
				<el-input v-model="form.name"></el-input>
			</div>
		</el-form-item>
		<el-form-item label="公开程度" prop="publicity">
			<el-switch
				v-model="form.publicity"
				:active-value="'True'"
				:inactive-value="'False'"
				active-text="公开"
				inactive-text="秘密"
			></el-switch>
		</el-form-item>
		<el-form-item label="汇报人" prop="reporter">
			<!-- <el-input v-model="form.reporter"></el-input> -->
			{{ form.reporter }}
		</el-form-item>
		<el-form-item label="上传时间" prop="preset_time">
			<!-- <el-date-picker type="date" v-model="form.preset_time" value-format="YYYY-MM-DD"></el-date-picker> -->
			{{ form.preset_time }}
		</el-form-item>

		<el-form-item label="议题附件" prop="file">
			<!-- <el-date-picker type="date" v-model="form.preset_time" value-format="YYYY-MM-DD"></el-date-picker> -->
			<el-link :href="form.file" :icon="Download" type="">下载附件</el-link>
		</el-form-item>

		<el-form-item v-permiss="16" label="议题状态" prop="state">
			<div  v-if="form.state!=='送审'">{{ form.state }}</div>
			<div v-else>
				<el-radio-group v-model="form.state" size="large">
					<el-radio-button v-show="false" label="送审" />
					<el-radio-button label="通过" />
					<el-radio-button label="驳回" />
				</el-radio-group>
			</div>
		</el-form-item>

		<el-form-item :disabled="form.state!=='送审'" v-permiss="16"  label="审核意见" prop="proposal">
			<!-- <el-date-picker type="date" v-model="form.preset_time" value-format="YYYY-MM-DD"></el-date-picker> -->
			<el-input
				v-model="form.proposal"
				:autosize="{ minRows: 2 }"
				type="textarea"
				placeholder="请写下宝贵的审核意见"
			/>
		</el-form-item>

		<el-form-item>
			<el-button type="primary" @click="saveEdit(formRef)">保 存</el-button>
		</el-form-item>
	</el-form>
</template>

<script lang="ts" setup>
import { ElMessage, FormInstance, FormRules } from 'element-plus';
import { ref } from 'vue';
import { Download } from '@element-plus/icons-vue';

// const emit = defineEmits(['finish-edit']);  // 定义要发射的事件
const props = defineProps({
	data: {
		type: Object,
		required: true
	},
	edit: {
		type: Boolean,
		required: false
	},
	update: {
		type: Function,
		required: true
	}
});

const defaultData = {
	id: -1,
	name: '',
	publicity: '公开',
	reporter: '',
	state: '送审',
	preset_time: new Date(),
	proposal:'',
	file:''
};

let is_admin=localStorage.getItem("role") === 'admin';

const form = ref({ ...(props.edit ? props.data : defaultData) });


const rules: FormRules = {
	name: [{ required: true, message: '议题名称', trigger: 'blur' }]
};
const formRef = ref<FormInstance>();
const saveEdit = (formEl: FormInstance | undefined) => {
	if (!formEl) return;
	formEl.validate(valid => {
		if (!valid) return false;
		props.update(form.value);
		ElMessage.success('保存成功！');
	});

	// emit('finish-edit', form.value);
};


// const handleAvatarSuccess: UploadProps['onSuccess'] = (response, uploadFile) => {
// 	form.value.thumb = URL.createObjectURL(uploadFile.raw!);
// };

// const beforeAvatarUpload: UploadProps['beforeUpload'] = rawFile => {
// 	if (rawFile.type !== 'image/jpeg') {
// 		ElMessage.error('Avatar picture must be JPG format!');
// 		return false;
// 	} else if (rawFile.size / 1024 / 1024 > 2) {
// 		ElMessage.error('Avatar picture size can not exceed 2MB!');
// 		return false;
// 	}
// 	return true;
// };
</script>

<style>
.avatar-uploader .el-upload {
	border: 1px dashed var(--el-border-color);
	border-radius: 6px;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	transition: var(--el-transition-duration-fast);
}

.avatar-uploader .el-upload:hover {
	border-color: var(--el-color-primary);
}

.el-icon.avatar-uploader-icon {
	font-size: 28px;
	color: #8c939d;
	width: 178px;
	height: 178px;
	text-align: center;
}
</style>
